
var map;
var markersArray = [];
var markersData = [];
var markersShow = [];
//var imagen;
//var limits;
//var geocoder;


$(document).ready(function(){
    $(function() {
        
        geocoder = new google.maps.Geocoder();
        var myLatlng = new google.maps.LatLng(35.029996,-28.652344);
        var myOptions = {
            zoom: 2,
            center: myLatlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        }
        map = new google.maps.Map(document.getElementById("mapa"), myOptions);
        
        
        
        var meses = ['Enero','Febrero','Marzo','Abril','Mayo','Junio','Julio','Agosto','Septiembre','Octubre','Noviembre','Diciembre'];
        var valores = [];
        //var i=0;
        //var j=0;
        
        for(var j=0;j<7;j++)
        {
            for(var i=0;i<12;i++)
            {
                valores[(i+(j*12))]=meses[i]+" "+String(2009+j+1);
            }
        }

        $( "#slider-range" ).slider({
            range: true,
            min: 0,
            max: valores.length-1,
            values: [4,20],
            slide: function( event, ui ){
                $("#amount").text(valores[ui.values[0]]+" - "+valores[ui.values[1]]);
               
            },
            stop: function( event, ui ){
 
                
                
                for (i in markersArray)
                {
                    
                    var mes = meses[parseInt(markersData[i].fecha.split("/")[1])-1];
                    var anio = parseInt(markersData[i].fecha.split("/")[2]);
                    var fecha=mes+" "+String(anio);
                    //       var minimoMes = parseInt(meses.indexOf(valores[$("#slider-range").slider("values",0)].split(" ")[0]));
                    //       var maximoMes = parseInt(meses.indexOf(valores[$("#slider-range").slider("values",1)].split(" ")[0]));
                    //       var minimoAnio = parseInt(valores[$("#slider-range").slider("values",0)].split(" ")[1]);
                    //       var maximoAnio = parseInt(valores[$("#slider-range").slider("values",1)].split(" ")[1]);
                            
                    if(valores.indexOf(fecha)>=ui.values[0] && valores.indexOf(fecha)<=ui.values[1])
                    {
                        markersArray[i].setMap(map);
                        markersShow[i]=true;
                    }
                    else
                    {
                        markersArray[i].setMap(null);
                        markersShow[i]=false;
                    }
                                
                }
            }
        });
        $("#amount").text(valores[$("#slider-range").slider("values",0)]+
            " - "+valores[$("#slider-range").slider("values",1)]);
    
    
    

        
    
    
        $.ajax({
            type: "GET",              
            url: "cgis/volcadoMarcadores.cgi", // URL of the Perl script
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            // send username and password as parameters to the Perl script
            data: "",
            // script call was *not* successful
            error: function(XMLHttpRequest, textStatus, errorThrown) {
                $('div#con').text("responseText: " + XMLHttpRequest.responseText 
                    + ", textStatus: " + textStatus 
                    + ", errorThrown: " +errorThrown);
                $('div#con').addClass("error");
            }, // error 
            // script call was successful 
            // data contains the JSON values returned by the Perl script 
            success: function(data){        
                if (data.error) { // script returned error
                    $('div#con').text("data.error: " + data.error);
                } // ifd
                else { // login was successful
                    //1.2-posicion del marcador
                    
                    if(parseInt(data.hits)<1)
                    {
                        alert("No hay marcadores");
                    }
                    else
                    {
                        var i=0;

                        for (i in data.marcadores){
                            
                            
                            
                            
                            
                                
                            
                            var myMarkerPosition = new google.maps.LatLng(data.marcadores[i].xPosition,data.marcadores[i].yPosition);
                            var tipo=data.marcadores[i].tipo;
                            //1.3-coloco el marcador
                            switch(tipo){
                                case "reunion":
                                    imagen = './images/group-2.png';
                                    break;
                                case "videojuegos":
                                    imagen = './images/videogames.png';
                                    break;
                                case "comida":
                                    imagen = './images/food.png';
                                    break;
                                case "compra":
                                    imagen = './images/supermarket.png';
                                    break;
                                case "cine":
                                    imagen = './images/cinema.png';
                                    break;
                                case "fiesta":
                                    imagen = './images/dancinghall.png';
                                    break;
                                case "concierto":
                                    imagen = './images/music_live.png';
                                    break;
                                case "otros":
                                    imagen = './images/regroup.png';
                                    break;
                                default:
                                    imagen = './images/regroup.png';
                                    break;
                            }
                            
                            var mapa;
                            var mes = meses[parseInt(data.marcadores[i].fecha.split("/")[1])-1];
                            var anio = parseInt(data.marcadores[i].fecha.split("/")[2]);
                            var fecha=mes+" "+String(anio);
                            if(valores.indexOf(fecha)>=$("#slider-range").slider("values",0) && valores.indexOf(fecha)<=$("#slider-range").slider("values",1))
                            {
                                mapa=map;
                                markersShow.push(true);
                            }
                            else
                            {
                                mapa=null;
                                markersShow.push(false);
                            }
                            
                            marker = new google.maps.Marker({
                                position: myMarkerPosition,
                                map: mapa,
                                icon: imagen,
                                info: '<div id="content">'+
                                '<div id="siteNotice">'+
                                '</div>'+
                                '<h1 id="firstHeading" class="firstHeading">'+data.marcadores[i].ciudad+'</h1>'+
                                '<div id="bodyContent">'+
                                '<p>'+'Situation: <span>'+data.marcadores[i].direccion+'</span></p>'+
                                '<p>'+'Fecha: <span>'+data.marcadores[i].fecha+'</span></p>'+
                                '<p>'+'Hora: <span>'+data.marcadores[i].hora+'</span></p>'+
                                '<p>'+'Autor: <span>'+data.marcadores[i].autor+'</span></p>'+
                                '<p>'+'Tipo: <span>'+data.marcadores[i].tipo+'</span></p>'+
                                '<p>'+data.marcadores[i].comment+'</p>'+
                                '</div>'+
                                '</div>'
                            });
                            
                            
                            //            limits.extend(myMarkerPosition);
                            //               var infowindow = new google.maps.InfoWindow({
                            //                  content: marker[i]['info']
                            //                 , 
                            //                zIndex: 3
                            //           });
                            //           infowindow.open(map,marker[i]);
                            google.maps.event.addListener(marker, 'click', function() {
                                infowindow = new google.maps.InfoWindow({
                                    content: this['info'], 
                                    zIndex: 3
                                });
                                infowindow.open(map,this);
                            });
                            
                            markersArray.push(marker);
                            markersData.push(data.marcadores[i]);
                            
                            
                            
                        }//for
    
    
    
    
                    //limits = new google.maps.LatLngBounds();

                    }
                } //else
            } // success
        }); // ajax     
    });

});
 
function codeAddress() {
    var address = document.getElementById("ciudad").value;
    if(document.getElementById("ciudad").value!=null && document.getElementById("ciudad").value!="")
    {
        geocoder.geocode( {
            'address': address
        }, function(results, status) {
            if (status == google.maps.GeocoderStatus.OK) {
                map.setCenter(results[0].geometry.location);
            //           var marker = new google.maps.Marker({
            //               map: map, 
            //               position: results[0].geometry.location
            //          });
            } else {
                alert("Geocode was not successful for the following reason: " + status);
            }
        });
    }
    else
    {
        alert("Introduce un destino");
    }
}

function showEvent() {
    if (markersArray) {
        var ciudad = document.getElementById("ciudad").value;
        if (ciudad) { // values are not empty
            for (i in markersArray)
            {
                if(markersData[i].ciudad==ciudad){
                    markersArray[i].setMap(map);
                    markersShow[i]=true;
                }
            }
        } // if
        else
        {
        }
    }
}

function hideEvent() {
    if (markersArray) {
        var ciudad = document.getElementById("ciudad").value;
        if (ciudad) { // values are not empty
            for (i in markersArray) {
                if(markersData[i].ciudad==ciudad){
                    markersArray[i].setMap(null);
                    markersShow[i]=false;
                }
            }
        } // if
        else
        {
        }
    }
}